<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>小米官网</title>
    <link rel="stylesheet" href="./css/base.css">
    <link rel="stylesheet" href="./css/index.css">
</head>

<body id="head">


    <div class="header">
        <div class="container">
            <div class="ban">
                <a href="" style="border: 0;">小米官网</a>
                <span class="span">|</span>
                <a href="">小米商城</a>
                <span class="span">|</span>
                <a href="">小米澎湃OS</a>
                <span class="span">|</span>
                <a href="">小米汽车</a>
                <span class="span">|</span>
                <a href="">云服务</a>
                <span class="span">|</span>
                <a href="">loT</a>
                <span class="span">|</span>
                <a href="">有品</a>
                <span class="span">|</span>
                <a href="">小爱开发平台</a>
                <span class="span">|</span>
                <a href="">资质证照</a>
                <span class="span">|</span>
                <a href="">协议规则</a>
                <span class="span">|</span>
                <a href="">下载APP</a>
                <span class="span">|</span>
                <a href="">Select&nbsp;Location</a>
                <span class="span">|</span>

            </div>
            <div class="grd_r">
                <div class="car">
                    <a href="">登录</a>
                    <span class="span">|</span>
                    <a href="">注册</a>
                    <span class="span">|</span>
                    <a href="">消息通知</a>
                </div>
                <a href="" class="gwc">
                    <i class="iconfont icon-gouwuche">购物车</i>
                    <div class="carlist">购物车中还没有商品，赶紧选购吧！
                    </div>
                </a>
            </div>
        </div>
    </div>
    <div class="van">
        <div class="container">

            <a href="" class="logo">
                <i class="iconfont icon-icon-xiaomiguishu"></i>
            </a>
            <ul class="new">
                <li><a href="">Xiaomi手机</a>
                    <div class="level2"> </div>
                </li>
                <li><a href="">Redme手机</a>
                    <div class="level2"></div>
                </li>
                <li><a href="">电视</a>
                    <div class="level2"></div>
                </li>
                <li><a href="">笔记本</a>
                    <div class="level2"></div>
                </li>
                <li><a href="">平板</a>
                    <div class="level2"></div>
                </li>
                <li><a href="">家电</a>
                    <div class="level2"></div>
                </li>
                <li><a href="">路由器</a>
                    <div class="level2"></div>
                </li>
                <li><a href="">服务中心</a>
                </li>
                <li><a href="">社区</a>
                </li>

            </ul>

            <form action="" method="get" class="search2">
                <div>
                    <input type="search" class="search">
                    <div class="list">
                        <ul class="new1">
                            <li>手机换新</li>
                            <li>小米手环</li>
                            <li>笔记本</li>
                            <li>Redmi&nbsp;K70至尊版</li>
                            <li>门锁</li>
                            <li>热水器</li>
                            <li>晾衣架</li>
                            <li>充电宝</li>
                        </ul>
                    </div>
                </div>
                <button type="submit" class="sousuo" value="">
                    <i class="iconfont icon-sousuo"></i>
                </button>


            </form>

        </div>
    </div>
    <div class="banns">
        <div class="container">
            <div class="select">
                <div class="ull">
                    <ul class="new3">
                        <li>
                            <span>手机</span>
                            <span>&gt;</span>
                            <div class="level3"></div>
                        </li>
                        <li>
                            <span>电视</span>
                            <span>&gt;</span>
                            <div class="level3"></div>
                        </li>
                        <li><span>家电</span>
                            <span>&gt;</span>
                            <div class="level3"></div>
                        </li>
                        <li><span>笔记本&nbsp;平板&nbsp;显示器</span>
                            <span>&gt;</span>
                            <div class="level3"></div>
                        </li>
                        <li><span>出行&nbsp;穿戴</span>
                            <span>&gt;</span>
                            <div class="level3"></div>
                        </li>
                        <li><span>耳机&nbsp;音响</span>
                            <span>&gt;</span>
                            <div class="level3"></div>
                        </li>
                        <li><span>健康&nbsp;儿童</span>
                            <span>&gt;</span>
                            <div class="level3"></div>
                        </li>
                        <li><span>生活&nbsp;箱包</span>
                            <span>&gt;</span>
                            <div class="level3"></div>
                        </li>
                        <li><span>智能&nbsp;路由器</span>
                            <span>&gt;</span>
                            <div class="level3"></div>
                        </li>
                        <li><span>电源&nbsp;配件</span>
                            <span>&gt;</span>
                            <div class="level3"></div>
                        </li>
                    </ul>
                </div>
                <div class="banner">
                    <a href=""><img
                            src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/4ffb73a53f05b6b8d864fa8260c7809e.jpg?thumb=1&w=2452&h=920&f=webp&q=90"
                            alt=""></a>
                </div>
            </div>
        </div>
    </div>
    <div class="product">
        <div class="container">
            <div class="time">
                <ul class="card">
                    <li><a><img src="./images/fuwu.png" alt="保障服务"></a>
                        <span>保障服务</span>
                    </li>
                    <li><a><img src="./images/qiye.png" alt="企业团购"></a>
                        <span>企业团购</span>
                    </li>
                    <li><a><img src="./images/Fma.png" alt="F码通道"></a>
                        <span>F码通道</span>
                    </li>
                    <li>
                        <a><img src="./images/card.png" alt="米粉卡">

                        </a>
                        <span>米粉卡</span>
                    </li>
                    <li>
                        <a><img src="./images/renew.png" alt="以旧换新">

                        </a>
                        <span>以旧换新</span>
                    </li>
                    <li>
                        <a>
                            <img src="./images/huafei.png" alt="话费充值 ">

                        </a>
                        <span>话费充值</span>
                    </li>

                </ul>
            </div>
            <div class="watch">
                <div class="ul">
                    <li><a href=""><img src="./images/phone.png" alt=""></a></li>
                    <li><a href=""><img src="./images/watch.jpg" alt=""></a></li>
                    <li><a href=""><img src="./images/pro.png" alt=""></a></li>
                </div>
            </div>
        </div>
    </div>
    <div class="drugon">
        <div class="container">
            <div class="phones">
                <a href=""><img src="./images/2phone.webp" alt=""></a>
            </div>
        </div>
    </div>
    <div class="phone">
        <div class="container">
            <div class="more">
                <a href="" style="float: left;">手机</a>
                <a href="" style="float: right;" class="jiantou">查看更多<img src="" alt="">
                    <i class="iconfont icon-jiantou jiantou"></i></a>

            </div>
            <div class="span">
                <ul class="phonebig">
                    <li><a href=""><img src="./images/1.webp" alt=""></a></li>
                </ul>
                <ul class="list">
                    <li><a href="">
                            <div class="figure"><img src="./images/1.1.webp" alt=""></div>
                        </a>
                        <h3 class="title"> Xiaomi&nbsp;15</h3>
                        <p class="desc">徕卡光学 Summilux 高速镜头｜骁龙®8至尊版移动平台｜5400mAh 小米金沙江电池 小米澎湃OS 2</p>
                        <p class="price">4499元起</p>

                    </li>
                    <li><a href="">
                            <div class="figure"><img src="./images/1.2.webp" alt=""></div>
                        </a>
                        <h3 class="title"> Xiaomi&nbsp;15Pro</h3>
                        <p class="desc">徕卡光学 Summilux 高速镜头｜骁龙®8至尊版移动平台｜5400mAh 小米金沙江电池 小米澎湃OS 2</p>
                        <p class="price">5299元起</p>
                    </li>
                    <li><a href="">
                            <div class="figure">><img src="./images/1.3.webp" alt=""></div>
                        </a>
                        <h3 class="title"> Xiaomi&nbsp;15&nbsp;定制版</h3>
                        <p class="desc">徕卡光学 Summilux 高速镜头｜骁龙®8至尊版移动平台｜5400mAh 小米金沙江电池 小米澎湃OS 2</p>
                        <p class="price">4999元起</p>
                    </li>
                    <li><a href="">
                            <div class="figure"><img src="./images/1.4.webp" alt=""></div>
                        </a>
                        <h3 class="title"> Redmi&nbsp;Note&nbsp;14&nbsp;＋</h3>
                        <p class="desc">徕卡光学 Summilux 高速镜头｜骁龙®8至尊版移动平台｜5400mAh 小米金沙江电池 小米澎湃OS 2</p>
                        <p class="price">1899元起<span><del style="margin-left: 7px;color: #b0b0b0">1999元</del></span></p>

                    </li>
                    <li><a href="">
                            <div class="figure"><img src="./images/1.5.webp" alt=""></div>
                        </a>
                        <h3 class="title">Redmi&nbsp;Note&nbsp;14&nbsp;Pro</h3>
                        <p class="desc">天玑7300-Ultra</p>
                        <p class="price">1399元起<del style="color: #b0b0b0;margin-left: 7px;">1399元</del></p>

                    </li>
                    <li><a href="">
                            <div class="figure"><img src="./images/1.6.webp" alt=""></div>
                        </a>
                        <h3 class="title">Redmi&nbsp;K70&nbsp;至尊版</h3>
                        <p class="desc">性能魔王&nbsp;全面进化</p>
                        <p class="price">2499元起</p>
                    </li>
                    <li>
                        <div class="figure"><a href=""><img src="./images/1.7.webp" alt=""></div></a>
                        <h3 class="title"> Xiaomi&nbsp;MIX&nbsp;Flip</h3>
                        <p class="desc">4.01英寸多功能超大外屏</p>
                        <p class="price">5999元起</p>
                    </li>
                    <li><a href="">
                            <div class="figure"><img src="./images/1.8.webp" alt=""></div>
                        </a>
                        <h3 class="title"> Xiaomi&nbsp;MIX&nbsp;Fold&nbsp;4</h3>
                        <p class="desc">超轻薄四曲面机身|小米龙骨转轴2.0</p>
                        <p class="price">8999元起</p>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <div class="electric">
        <div class="container">
            <div class="mores">
                <a href="" style="float: left;">家电</a>
                <div class="jiadian">
                    <a href="" style="float: left;">热门&nbsp;&nbsp;&nbsp;&nbsp;</a>
                    <a href="" style="float: left;">电视影音&nbsp;&nbsp;&nbsp;&nbsp;</a>
                    <a href="" style="float: left;">空调</a>
                </div>
            </div>
            <div class="watchs">
                <ul class="bigwatch">
                    <li><a href=""><img src="./images/2.1.webp" alt=""></a></li>
                </ul>
                <ul class="list2">
                    <li><a href="">
                            <div class="figure2"><img src="./images/2.2.webp" alt=""></div>
                        </a>
                        <h3 class="title"> 小米电视S系列</h3>
                        <p class="desc">144HZ超高刷 3+32G 多色温色彩还原技术</p>
                        <p class="price">2599元起</p>

                    </li>
                    <li><a href="">
                            <div class="figure"><img src="./images/2.3.webp" alt=""></div>
                        </a>
                        <h3 class="title">小米电视S&nbsp;Pro&nbsp;Mini&nbsp;LED系列</h3>
                        <p class="desc">144Hz超高刷、4+64G大存储</p>
                        <p class="price">4999元起</p>
                    </li>
                    <li><a href="">
                            <div class="figure"><img src="./images/2.4.webp" alt=""></div>
                        </a>
                        <h3 class="title"> 小米电视S&nbsp;Mini&nbsp;LED系列</h3>
                        <p class="desc">Mini LED 高分区背光、1200nits峰值亮度</p>
                        <p class="price">2999元起</p>
                    </li>
                    <li><a href="">
                            <div class="figure"><img src="./images/2.5.webp" alt=""></div>
                        </a>
                        <h3 class="title"> 巨省电 小米空调 1.5匹新1级能效</h3>
                        <p class="desc">强劲制冷 | 高效节能 | 智能互联</p>
                        <p class="price">2499元起</p>

                    </li>
                </ul>
            </div>
            <div class="watchs">
                <ul class="bigwatch">
                    <li><a href=""><img src="./images/3.1.webp" alt=""></a></li>
                </ul>
                <ul class="list2">
                    <li><a href="">
                            <div class="figure2"><img src="./images/3.2.webp" alt=""></div>
                        </a>
                        <h3 class="title">米家新风空调 立式3匹</h3>
                        <p class="desc">全屋快通风，就要大新风</p>
                        <p class="price">5999元起<del style="color: #b0b0b0;margin-left: 7px;">7299元</del></p>

                    </li>
                    <li><a href="">
                            <div class="figure"><img src="./images/3.3.webp" alt=""></div>
                        </a>
                        <h3 class="title">米家迷你波轮洗衣机Pro 3kg</h3>
                        <p class="desc">全景玻璃阻尼上盖 防夹手</p>
                        <p class="price">999元起<del style="color: #b0b0b0;margin-left: 7px;">1499元</del></p>
                    </li>
                    <li><a href="">
                            <div class="figure"><img src="./images/3.4.webp" alt=""></div>
                        </a>
                        <h3 class="title">米家迷你波轮洗衣机Pro 3kg</h3>
                        <p class="desc">高温煮洗 杀菌除螨</p>
                        <p class="price">849元起<del style="color: #b0b0b0;margin-left: 7px;">1599元</del></p>
                    </li>
                    <div class="slip">
                        <ul class="slip1">
                            <li class="sss">
                                <div style="float: left;">
                                    <h3 class="title" style="width: 94px;height: 42px;display: block;">
                                        米家冰箱无霜两门186L</h3>
                                    <p class="price" style="float: left;width: 94px;height: 21px;float: left;">1199元起
                                    </p>
                                </div>

                                <a href="">
                                    <div class="figure" style="float: right;"><img src="./images/3.5.webp" alt=""></div>
                                </a>
                            </li>
                        </ul>
                        <ul class="slip2">
                            <li class="slips">
                                <div>
                                    <div style="float: left;width: 94px;height: 25px;line-height: 25px;">
                                        <h class="title">浏览更多</h>
                                        <a class="desc">热门</a>
                                    </div>
                                    <span style="float: right;height: 50px;line-height: 50px;padding-right: 50px;"><i
                                            class="iconfont icon-jiantou"></i></a></span>

                                </div>

                            </li>
                        </ul>
                    </div>

                </ul>
            </div>
            <div class="pen">
                <img src="./images/pen.webp" alt="">
            </div>
        </div>
    </div>
    <div class="xiu">
        <div class="container">
            <div class="xiuvan">
                <ul class="relax">
                    <li><a href="" class="iconfont icon-weixiu"></a>预约维修服务</li>
                    <li><a href="" class="iconfont icon-qitian"></a>预约维修服务</li>
                    <li><a href="" class="iconfont icon-tian"></a>预约维修服务</li>
                    <li><a href="" class="iconfont icon-liwuhuodong"></a>预约维修服务</li>
                    <li class="last"><a href="" class="iconfont icon-dizhi"></a>预约维修服务</li>

                </ul>
            </div>
        </div>
    </div>
    <div class="about">
        <div class="container">
            <div class="about_left">
                <ul class="us">
                    <li class="if">选购指南</li>
                    <li>手机</li>
                    <li>电视</li>
                    <li>笔记本</li>
                    <li>平板</li>
                    <li>穿戴</li>
                    <li>耳机</li>
                    <li>家电</li>
                    <li>路由器</li>
                    <li>音箱</li>
                    <li>配件</li>
                </ul>
                <ul class="us">
                    <li class="if">服务中心</li>
                    <li>申请售后</li>
                    <li>售后政策</li>
                    <li>维修服务价格</li>
                    <li>订单查询</li>
                    <li>以旧换新</li>
                    <li>保障服务</li>
                    <li>防伪查询</li>
                    <li>F码通道</li>
                </ul>
                <ul class="us">
                    <li class="if">线下门店</li>
                    <li>小米之家</li>
                    <li>服务网点</li>
                    <li>授权体验店/专区</li>
                </ul>
                <ul class="us">
                    <li class="if">关于小米</li>
                    <li>了解小米</li>
                    <li>加入小米</li>
                    <li>投资者关系</li>
                    <li>可持续发展</li>
                    <li>廉洁举报</li>
                </ul>
                <ul class="us">
                    <li class="if">关注我们</li>
                    <li>新浪微博</li>
                    <li>官方微信</li>
                    <li>联系我们</li>
                    <li>公益基金会</li>
                </ul>
            </div>
            <div class="about_right">
                <div class="top">
                    <h1 class="org">400-100-5678</h1>
                    <p class="small">8:00-18:00(仅收市话费)</p>
                    <div class="kefu">
                        人工客服
                    </div>
                </div>
                <div class="bottom">
                    <h1 class="org">400-180-8888</h1>
                    <p class="small">8:00-18:00(仅收市话费)</p>
                    <p class="small">适用于:MIX FOLD、巨屏电视系列</p>
                    <div class="kefu">
                        人工客服
                    </div>
                </div>
            </div>

        </div>
    </div>
    <div class="float">
        <ul class="you" style="position: absolute;">

            <li>
                <i class="iconfont icon-shouji"></i>
                手机APP
            </li>
            <li>
                <i class="iconfont icon-geren"></i>
                个人中心
            </li>
            <li><i class="iconfont icon-shouhouweixiu"></i>
                售后维修
            </li>
            <li>
                <i class="iconfont icon-kefu"></i>
                客服
            </li>
            <li class="gouwu">
                <i class="iconfont icon-gouwuche"></i>
                购物车
            </li>
            <a href="#head">
                <li class="news1" style="position: absolute;
    bottom: -111px;
    height: 86px;
    width: 84px;
    border: 1px solid #f5f5f5;">
                    <i class="iconfont icon-huidingbu"></i>
                    回顶部
                </li>
            </a>
        </ul>
    </div>

</body>

</html>